export function genetorGeoJosn(boxExtent, nums) {
  const geojsonPoints = {
    type: "FeatureCollection",
    features: [],
  };

  // 创建15个随机点位
  for (var i = 0; i < nums; i++) {
    const longitude = (boxExtent.xmin + Math.random() * (boxExtent.xmax - boxExtent.xmin)).toFixed(6);
    const latitude = (boxExtent.ymin + Math.random() * (boxExtent.ymax - boxExtent.ymin)).toFixed(6);

    geojsonPoints.features.push({
      id: i + 1,
      type: "Feature",
      geometry: {
        type: "Point",
        coordinates: [longitude, latitude],
      },
      properties: {
        id: i + 1,
        type: Math.floor(Math.random() * 3),
        name: "测试点" + (i + 1),
      },
    });
  }

  console.log(geojsonPoints);
  return geojsonPoints;
}


export function genetorData(nums) {
  const data = [];
  // const iconArr = ['tri', 'rect', 'star']
  // 创建15个随机点位
  for (var i = 0; i < nums; i++) {
    data.push({
      id: i + 1,
      type: Math.floor(Math.random() * 3)
    });
  }

  console.log(data);
  return data;
}

/**
 *
 */
export function drawCanvas() {
  // 创建 Canvas 元素
  const canvasTri = document.createElement("canvas");
  canvasTri.width = 40; // 设置 Canvas 宽度
  canvasTri.height = 40; // 设置 Canvas 高度
  // 获取绘图上下文
  const ctxTri = canvasTri.getContext("2d");
  // 画一个三角形
  ctxTri.beginPath();
  ctxTri.moveTo(20, 0);
  ctxTri.lineTo(0, 40);
  ctxTri.lineTo(40, 40);
  ctxTri.closePath();
  ctxTri.fillStyle = '#ff0000';
  ctxTri.fill(); 
  const dataURITri = canvasTri.toDataURL();

  // 创建 Canvas 元素
  const canvasRect = document.createElement("canvas");
  canvasRect.width = 40; // 设置 Canvas 宽度
  canvasRect.height = 40; // 设置 Canvas 高度
  // 获取绘图上下文
  const ctxRect = canvasRect.getContext("2d");
  // 画一个矩形
  ctxRect.beginPath();
  ctxRect.rect(0, 0, 40, 40);
  ctxRect.closePath
  ctxRect.fillStyle = 'blue';
  ctxRect.fill();
  const dataURIRect = canvasRect.toDataURL();

  ctxRect.fillStyle = 'grey';
  ctxRect.fill();
  const dataURIRectGrey = canvasRect.toDataURL();

  // 创建 Canvas 元素
  const canvas = document.createElement("canvas");
  canvas.width = 40; // 设置 Canvas 宽度
  canvas.height = 40; // 设置 Canvas 高度
  // 获取绘图上下文
  const ctx = canvas.getContext("2d");
  // 定义五角星的中心点坐标和大小
  const centerX = canvas.width / 2;
  const centerY = canvas.height / 2;
  const radius = 20;

  // 绘制五角星
  ctx.beginPath();
  for (var i = 0; i < 5; i++) {
    let angle = ((Math.PI * 2) / 5) * i - Math.PI / 2;
    let x = centerX + Math.cos(angle) * radius;
    let y = centerY + Math.sin(angle) * radius;

    ctx.lineTo(x, y);

    angle += (Math.PI * 2) / 5 / 2;
    x = centerX + (Math.cos(angle) * radius) / 2;
    y = centerY + (Math.sin(angle) * radius) / 2;

    ctx.lineTo(x, y);
  }
  ctx.closePath();

  ctx.fillStyle = "red";
  ctx.fill();

  const dataURIStar = canvas.toDataURL();

  return [
    {
      id: 'tri',
      imgUrl: dataURITri
    },
    {
      id: 'rect-grey',
      imgUrl: dataURIRectGrey
    },
    {
      id: 'rect',
      imgUrl: dataURIRect
    },
    {
      id: 'rect-grey',
      imgUrl: dataURIRectGrey
    },
    {
      id: 'star',
      imgUrl: dataURIStar
    }
  ];
}
